<p class='device_notification' style='color:red;'></p>
<table>
  <h3>PBR Properties</h3>
  <tr>
    <td>
      <label>Color: </label>
      <input class='color' type='color', value='#FFFFFF'/>
    </td>
  </tr>
  <tr>
    <td>
      <label>Roughness: </label>
      <input class='roughness' type='range' min='0.0' max='1.0' value='1.0' step='0.01' oninput="this.nextElementSibling.value = this.value"/>
      <output>1.00</output>
    </td>
  </tr>
  <tr>
    <td>
      <label>Metallic: </label>
      <input class='metallic' type='range' min='0.0' max='1.0' value='1.0' step='0.01' oninput="this.nextElementSibling.value = this.value"/>
      <output>1.00</output>
    </td>
  </tr>
  <tr>
    <td>
      <label>Normal Strength: </label>
      <input class='normal' type='range' min='0.0' max='1.0' value='0.5' step='0.01' oninput="this.nextElementSibling.value = this.value"/>
      <output>0.50</output>
    </td>
  </tr>
  <tr>
    <td>
      <label>IOR: </label>
      <input class='ior' type='range' min='0.0' max='3.0' value='1.33', step='0.01' oninput="this.nextElementSibling.value = this.value"/>
      <output>1.33</output>
    </td>
  </tr>
</table>
<table>
  <h3>Environment Properties</h3>
  <tr>
    <td>
      <label>Use Textured Background: </label>
      <input class='use_background' type='checkbox' checked='true'/>
    </td>
  </tr>
  <tr>
    <td>
      <label>Specular Strength: </label>
      <input class='e_specular' type='range' min='0.0' max='2.0' value='1.0' step='0.01' oninput="this.nextElementSibling.value = this.value"/>
      <output>1.00</output>
    </td>
  </tr>
  <tr>
    <td>
      <label>Diffuse Strength: </label>
      <input class='e_diffuse' type='range' min='0.0' max='2.0' value='1.0' step='0.01' oninput="this.nextElementSibling.value = this.value"/>
      <output>1.00</output>
    </td>
  </tr>
  <tr>
    <td>
      <label>FOV: </label>
      <input class='angle' type='range' min='30' max='120' value='30' step='1' oninput="this.nextElementSibling.value = this.value"/>
      <output>30</output>
    </td>
  </tr>
</table>
